﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
    <title></title>
    <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css"/>
    <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css"/>
    <script language="javascript" type="text/javascript">
        //保存成功的提示信息
        function showResult() {
            showResultDiv(true);
            window.setTimeout("showResultDiv(false);", 3000);
        }

        function showResultDiv(flag) {
            var divResult = document.getElementById("save_result_info");
            if (flag)
                divResult.style.display = "block";
            else
                divResult.style.display = "none";
        }

        //自动查询账务账号
        function searchAccounts(txtObj) {
            //document.getElementById("a1").innerHTML = txtObj.value;
        }
    </script>
</head>
<body>
<!--Logo区域开始-->
<div id="header">
    <img src="../images/logo.png" alt="logo" class="left"/>
    <a href="#">[退出]</a>
</div>
<!--Logo区域结束-->
<!--导航区域开始-->
<div id="navi">
    <ul id="menu">
        <li><a href="../index.html" class="index_off"></a><>
        <li><a href="../user/user_info.html" class="information_off"></a><>
        <li><a href="../user/user_modi_pwd.html" class="password_off"></a><>
    </ul>
</div>

<!--导航区域结束-->
<!--主要区域开始-->
<div id="main">
    <!--保存操作的提示信息-->
    <div id="save_result_info" class="save_fail">保存失败！192.168.0.23服务器上已经开通过 OS 账号 “mary”。</div>

    <form action="" method="post" class="main_form" onsubmit=" return formCheck() ">
        <!--内容项-->
        <div class="text_info clearfix"><span>身份证：</span></div>
        <div class="input_info">
            <input type="text" id="idcardNo" value=" " class="width180"/>

            <input type="button" id="btnLarge" value="查询账务账号" class="btn_search_large"/>
            <!--<span class="required">*</span>-->
            <div id="validate_msg_short" class="validate_msg_short"></div>
        </div>
        <div class="text_info clearfix"><span>账务账号：</span></div>
        <div class="input_info">
            <input type="text" id="loginName" value=" "/>
            <!--<span class="required">*</span>-->
            <!--<div class="validate_msg_long">没有此账务账号，请重新录入。</div>-->
        </div>
        <div class="text_info clearfix"><span>资费类型：</span></div>
        <div id="div1" class="input_info">
            <select id="name" name="name">
                <!--<option id="option">5.9元套餐</option>-->
                <!--<option>6.9元套餐</option>-->
                <!--<option>8.5元套餐</option>-->
                <!--<option>450包月</option>-->
                <!--<option>20元套餐</option>-->
            </select>
        </div>

        <div class="text_info clearfix"><span>服务器 IP：</span></div>
        <div class="input_info">
            <input type="text" id="unixHost" name="unixHost" value=""/>
            <!--<span class="required">*</span>-->
            <div class="validate_msg_long">15 长度，符合IP的地址规范</div>
        </div>

        <div class="text_info clearfix"><span>登录 OS 账号：</span></div>
        <div class="input_info">
            <input type="text" id="osUsername" name="osUsername" value=""/>
            <!--<span class="required">*</span>-->
            <!--<div class="validate_msg_long">8长度以内的字母、数字和下划线的组合</div>-->
        </div>

        <div class="text_info clearfix"><span>密码：</span></div>
        <div class="input_info">
            <input id="loginPasswd" name="loginPasswd" type="password"/>
            <!--  <span class="required">*</span>-->
            <div class="validate_msg_long"></div>
            <!--<div class="validate_msg_long">30长度以内的字母、数字和下划线的组合</div>-->
        </div>
        <div class="text_info clearfix"><span>重复密码：</span></div>
        <div class="input_info">
            <input id="loginPassword" type="password"/>
            <!--<span class="required">*</span>-->
            <div class="validate_msg_long">两次密码必须相同</div>
        </div>

        <!--操作按钮-->
        <div class="button_info clearfix">
            <input type="button" id="but1" value="保存" class="btn_save"/>
            <input type="button" id="but2" value="取消" class="btn_save" onclick="cancel()"/>
        </div>
    </form>
</div>
<!--主要区域结束-->
<div id="footer">
    <span>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</span>
    <br/>
    <span>版权所有(C)云科技有限公司 </span>
</div>
</body>
<script type="text/javascript">


    $(function () {
        //判断密码(.blur失去焦点)
        $('#loginPassword').blur(function () {
            if ($('#loginPasswd').val() != $('#loginPassword').val()) {
                alert("两次密码不一致")
            }
        });

        //功能:按钮"取消"
        $('#but2').click(function () {
            $('#idcardNo').val('');
            $('#loginName').val('');
            $('#unixHost').val('');
            $('#osUsername').val('');
            $('#loginPasswd').val('');
            $('#loginPassword').val('');
        });

        //查询身份证号获取账务账号
        $('#btnLarge').click(function () {
            var idcardNo = $('#idcardNo').val();
            var account = {
                "idcardNo": idcardNo
            };
            console.log(account);
            var setting = {
                url: "/kobe/service/findAccountName",
                method: 'post',
                contentType: 'application/json',
                dataType: 'json',
                data: JSON.stringify(account),
                // success:aaa,
                // error:bbb
            };
            $.ajax(setting).done(aaa);
        });

        var accuntId;
        function aaa(resp) {
            console.log(resp);
            if (resp.length ===0) {
                alert("身份证号不对!")
            } else {
                for (var itmt of resp) {
                    console.log(itmt.loginName);
                    console.log(itmt.accountId);
                    $('#loginName').val(itmt.loginName);
                    accuntId = itmt.accountId;
                }
            }
        }

        //查询遍历资费类型
        $.ajax({
            type: "GET",
            url: "/kobe/service/findCostName",
            dataType: "json",
            success: function (resp) {
                // console.log(resp);
                // var div1= $('#div1');
                // for (item of resp){
                //     var select = $('<select></select>');
                //     var option = $('<option></option>').text(item.name)
                // }
                // select.append(option)
                // div1.append(select)
                var name = $('#name');
                for (var item of resp) {
                    var costName = $('<option></option>').text(item.name).val(item.costId);
                    name.append(costName);
                }
            }
        });

        //插入service表的业务账号信息
        $('#but1').click(function () {
            var name = $('#name').val();
            var unixHost = $('#unixHost').val();
            var osUsername = $('#osUsername').val();
            var loginPasswd = $('#loginPasswd').val();
            var costId = $('#name').val();

            console.log(accuntId);

            var data = {
                "accountId": accuntId,
                "costId": costId,
                "name": name,
                "osUsername": osUsername,
                "loginPasswd": loginPasswd,
                "unixHost": unixHost
            };
            var setting = {
                url: "/kobe/service/addService",
                method: "post",
                headers: {
                    "Content-Type": 'application/json'
                },
                //把数据转换成json格式传入到后台
                data: JSON.stringify(data),
                success: function (resp) {
                    if (resp > 0) {
                        location.href = "/kobe/service/service_list.html";
                    }
                }
            };
            $.ajax(setting);
        });
    })
</script>

</html>
